<? $this -> load -> view('header.php');?>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?libraries=geometry&sensor=false"></script>
<script>
	var icons = {
		'icon_land' : '<? echo base_url(); ?>img/symbol_star_gray.png',
		'icon_land-selected' : '<? echo base_url(); ?>img/symbol_star.png'
	};
	
	var currentPlace = null;
	var infowindow = new google.maps.InfoWindow();
	 var infowindow;
	$(document).ready(function() {
		var mapDiv = document.getElementById('map-canvas');
		var map = new google.maps.Map(mapDiv, {
			center : new google.maps.LatLng(15.024131, 105.315018),
			zoom : 10,
			mapTypeId : google.maps.MapTypeId.ROADMAP
		});
		
		$.get('<?echo base_url();?>/index.php/test/index2', function(data) {
			$.each($.parseJSON(data), function() {
				var place = this;
					var marker = new google.maps.Marker({
						position : new google.maps.LatLng(this.Lat, this.Lng),
						map : map,
						title : this.name,
						icon : icons['icon_land']
					});
	
					google.maps.event.addListener(marker, 'mouseover', function() {
					 var hidingMarker = currentPlace;
					 var contentString = '<div >'
					 +"Land Name:"+place.name+"<br/>"
					 +"Latitude:"+place.Lat+"<br/>"
					 +"Logtitude:"+place.Lng
					 +"<br/><a href='#'>More Detial</a>"
					 +'</div>';
					
				 infowindow.close();
					infowindow.setContent(contentString);
					
					  infowindow.open(map,marker);

			           
			            marker.setIcon(icons['icon_land-selected']);
			
			            if (currentPlace) {
			              currentPlace.setIcon(icons['icon_land']);		
			  
			            } else{
			            	
			            }
			            currentPlace = marker;
					})
			});
			
				//	map.setZoom(map.getBoundsZoomLevel(bounds)-1);
				
		});
	});
	

</script>

<div id="middle">
	<? $this -> load -> view('land/left_menu');?>
	<div id="center-column">
		<div class="top-bar">
			<div class="map">  
				<div id="map-canvas" style='height:500px; width: 700px'></div>
    		</div>
    		
		</div>
	</div>
	<div id="right-column" >
		<strong class="h">Quick Info</strong>
		<div class="box" >
			<div id="user_infor"></div>
		</div>
	</div>
</div>
<? $this -> load -> view('footer.php');?>